@if $use-forms == true {
  //------------------------------------
  //  FORMS
  //------------------------------------
  label { display: block; }

  input, 
  select, 
  textarea {
    border: 1px solid #ddd;
    height: 37px;
    padding: 5px;
    width: 100%;
    
    @include vendor(box-sizing, border-box);
  }

  @include breakpoint(extra-small) { 
    input, 
    select, 
    textarea { width: 90%; } 
  }

  @include breakpoint(small) { 
    input, 
    select { width: 300px; } 
  }

  input:focus, 
  select:focus, 
  textarea:focus, 
  button:focus, 
  [contenteditable="true"]:focus { 
    outline: none; 
    outline: thin dotted \9;
  }

  textarea { height: auto; }

  input {
    &[type="checkbox"], 
    &[type="file"], 
    &[type="image"], 
    &[type="radio"] {
      background: auto !important;
      border: auto !important;
      height: auto !important;
      width: auto !important;
    }
    
    &[disabled] { 
      cursor: not-allowed;
      background-color: #f6f6f6; 
    }
  }

  @include breakpoint(small) {	
    input[type="submit"] { width: auto; }
    
    textarea { width: 400px; }
  }

  select[disabled], 
  textarea[disabled] { background-color: #f6f6f6; }

  fieldset {
    border: 1px solid #ededed;
    padding: 10px 25px;
    
    legend {
      font-weight: bold;
      @include font-size(13px);
      padding: 0 10px;
    }
  }


  @if $use-form-styles == true {
    // Validation
    input.required:required:valid, 
    textarea.required:required:valid { border-color: #2ecc71; }

    input.required:focus:invalid, 
    textarea.required:focus:invalid { border-color: #e74c3c; }


    // Block-level form items
    .form-item {
      display: block;
      padding: 14px 0;
    }


    // Rounded corners
    form.border-radius {
      input, 
      select, 
      textarea, 
      fieldset { border-radius: $border-radius; }
    }


    // Inline Form
    .form-inline label { width: auto; }

    @include breakpoint(small) {
      .form-inline {
        label {
          display: inline-block;
          width: 100px;
        }
        
        textarea { width: auto; }
      }
    }


    // Placeholder text
    ::-webkit-input-placeholder { color: $placeholder-color; }

    :-ms-input-placeholder { color: $placeholder-color; }

    ::-moz-placeholder { color: $placeholder-color; }

    :-moz-placeholder { color: $placeholder-color; }
  }
}